<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>一键通服务/产品</title>
<%@ include file="/WEB-INF/views/layout/public_css.jsp"%>
<%@ include file="/WEB-INF/views/layout/public_js.jsp"%>
<style type="text/css">
.font-red {
	color:red;
}
.hot-sale {
	margin: 15px;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
   
});

</script>
</head>
<body>
<%@ include file="/WEB-INF/views/layout/head.jsp"%>
<div class="container-fluid">
    <div class="list-title">
    	社区服务分类
    </div>
    <div style="border: 1px solid #ddd;padding:10px;">
    	<h5>社区服务1</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
		<h5>社区服务2</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
		<h5>社区服务3</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
    </div>
    
    <div class="list-title">
    	社区产品分类
    </div>
    <div style="border: 1px solid #ddd;padding:10px;">
    	<h5>社区产品1</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
		<h5>社区产品2</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
		<h5>社区产品3</h5>
    	<div class="row" style="padding-left: 80px;">
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		  <div class="col-md-2">二级分类</div>
		</div>
    </div>
    <div style="border: 1px solid #ddd;padding:10px;">
	    <span class="hot-sale" style="font-size:1.5rem;">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <span class="hot-sale">热销产品</span>
	    <div class="row" style="margin-top: 15px;">
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		</div>
		
		<div class="row" style="margin-top: 15px;">
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		</div>
		<div class="row" style="margin-top: 15px;">
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		   <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		  <div class="col-md-2">
		  	<div class="thumbnail">
		      <img src="${ctx}/public/img/photos/img01.png" alt="...">
		      <div class="caption">
		        <p><span class="font-red" style="margin-right:10px;">¥  具体价格</span><span>销售数量</span></p>
		        <p><span>名称、关键指标</span></p>
		      </div>
		    </div>
		  </div>
		</div>
		<div class="dataTables_wrapper form-inline dt-bootstrap no-footer" style="margin:0 10px"><div class="row"><div class="col-sm-5"><div class="dataTables_info" id="cppl_table_info" role="status" aria-live="polite">显示第 1 至 18项结果，共 18 项</div></div><div class="col-sm-7"><div class="dataTables_paginate paging_full_numbers" id="cppl_table_paginate"><ul class="pagination"><li class="paginate_button first disabled" id="cppl_table_first"><a href="#" aria-controls="cppl_table" data-dt-idx="0" tabindex="0">首页</a></li><li class="paginate_button previous disabled" id="cppl_table_previous"><a href="#" aria-controls="cppl_table" data-dt-idx="1" tabindex="0">上页</a></li><li class="paginate_button active"><a href="#" aria-controls="cppl_table" data-dt-idx="2" tabindex="0">1</a></li><li class="paginate_button next disabled" id="cppl_table_next"><a href="#" aria-controls="cppl_table" data-dt-idx="3" tabindex="0">下页</a></li><li class="paginate_button last disabled" id="cppl_table_last"><a href="#" aria-controls="cppl_table" data-dt-idx="4" tabindex="0">末页</a></li></ul></div></div></div></div>
    </div>
</div>
</body>
</html>